//float x = r*cos(t) + h;
//float y = r*sin(t) + k;

var docFragment = document.createDocumentFragment();
// circle(100, 100)
for (var i = 0; i < 5; i++)
{
    var div = document.createElement('div');
    div.setAttribute('id', 'div-' + (i + 1));
    //div.style.left = 50 * Math.cos((((2 * Math.PI) / 5) * (i + 1))) + 100 + 'px';
    //div.style.top = 50 * Math.sin((((2 * Math.PI) / 5) * (i + 1))) + 100 + 'px';
    div.style.position = 'absolute';
    div.style.borderRadius = '100%';
    docFragment.appendChild(div);
}

document.body.appendChild(docFragment);

var y1 = (2 * Math.PI / 5) * 1;
var y2 = (2 * Math.PI / 5) * 2;
var y3 = (2 * Math.PI / 5) * 3;
var y4 = (2 * Math.PI / 5) * 4;
var y5 = (2 * Math.PI / 5) * 5;

function circularSpinning()
{
    var div1 = document.getElementById('div-1');
    div1.style.left = 50 * Math.cos(y1) + 100 + 'px';
    div1.style.top = 50 * Math.sin(y1) + 100 + 'px';

    var div2 = document.getElementById('div-2');
    div2.style.left = 50 * Math.cos(y2) + 100 + 'px';
    div2.style.top = 50 * Math.sin(y2) + 100 + 'px';

    var div3 = document.getElementById('div-3');
    div3.style.left = 50 * Math.cos(y3) + 100 + 'px';
    div3.style.top = 50 * Math.sin(y3) + 100 + 'px';

    var div4 = document.getElementById('div-4');
    div4.style.left = 50 * Math.cos(y4) + 100 + 'px';
    div4.style.top = 50 * Math.sin(y4) + 100 + 'px';

    var div5 = document.getElementById('div-5');
    div5.style.left = 50 * Math.cos(y5) + 100 + 'px';
    div5.style.top = 50 * Math.sin(y5) + 100 + 'px';

    y1 += 0.01;
    y2 += 0.01;
    y3 += 0.01;
    y4 += 0.01;
    y5 += 0.01;
}

setInterval('circularSpinning()', 10); // 10 milliseconds